<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Counter计数器</title>
    <script src="../Vue.js" type="text/javascript"></script>
</head>
<body>

    <div class="app">
        <button v-on:click="sub">-</button>
        <span>{{number}}</span>
        <button v-on:click="add">+</button>
    </div>

    <script>
        let app = new Vue({
            el:".app",
            data:{
            	number:0,
            },
            methods:{
            	sub:function () {
                    if (this.number<=0)
                    	alert('不要再按了啦!')
                    else
                    	this.number-=1
	            },
	            add:function () {
		            if (this.number>=10)
			            alert('不要再按了啦!')
		            else
			            this.number+=1
	            }
            }
        })
    </script>
</body>
</html>